<!DOCTYPE html>
<html>
<head>
    <title></title>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1">
    <link rel="stylesheet" href="Bootstrap/css/bootstrap.min.css">
	<link rel="stylesheet" href="http://cdn.bootcss.com/bootstrap/3.3.0/css/bootstrap.min.css">
    <script src="Bootstrap/js/jquery-1.11.1.min.js"></script>
    <script src="Bootstrap/js/bootstrap.min.js"></script>
    <script type="text/javascript">
        $(function() {

        });
    </script>
    <style type="text/css">
        *{
            margin: 0px;
            padding: 0px;
        }
        body,html {
            font-family: "微软雅黑";
            color: gray;
        }

        #myModalLabel{
            margin-left: 42%;
        }

        .bottom-menu {
            border-top: 1px solid #D3D3D3;
            margin: 0 auto;
            position: fixed;
            bottom: 0;
            text-align: center;
            background: #6699cc;}
        .list-group-item.active, .list-group-item.active:hover, .list-group-item.active:focus {
            border: 0px;
            background-color: #33CCCC;
        }

        .bottom-menu td {
            padding-top: 6px;
            font-size: 13px;
            height: 50px;
            width: 200px;
        }
        .index-menu {
            color: #B22222;
        }
        .my-center {
            background: #B22222;
            text-align: center;
        }

        .my-head {
            height: 80px;
            width: 80px;
            border-radius: 80px;
            border: 2px solid #66ffff;
            margin-left: 38%;
        }

        .head {
            padding-top: 10px;
            margin-left: 0;
            text-align: left;
            line-height: 25px;
            height: 90px;
        }

        .necheng {
            font-weight: bold;
            color: #2B2B2B;
        }

        /* 我的信息 */
        .my-info {
            width: 80%;
            matgin-top:40px;
        }

        .modal-body {
            height: 350px;
            margin-top: 30px;
        }.glyphicon-chevron-right{
             float: right;
         }.basic-info{
              text-align: center;
          }
        .modal-content{
            margin-top: 90px;
        }
        /* 评论内容 */
        #Info{
		white:100%;
		border-bottom: 1px solid #F2F2F2;
		border-top: 1px solid #F2F2F2; 
		min-height: 120px;
		}
	.left_img{
		width: 30%;
		float: left; 
		padding: 10px;
		font-size: 12px;
		color: black;
		position: absolute;
		
	}
	.left_img img{
		width: 80%;
		margin:0 auto;
		margin-bottom: 10px;
		border-radius: 15px;
	}
	.right_content{
	padding-right:15px;
	margin-top:15px;
	margin-bottom:5px;
		line-height:20px;
		width: 100%;
		overflow: hidden;
		padding-left:30%;
		text-align: justify;
	}
    </style>
</head>
<body>
<script>
    $(function () {
        var id = location.href.split("?")[1];
        $.ajax({
            url:"http://localhost:8080/zp/commentData?id="+id,
            type:"post",
            success:function (data) {

                for(var i = 0; i < data.length; ++i) {
                    var c = data[i];
                    var html = "";
                    var img = "http://localhost:8080"+c.photo;
                    html += " <div id='Info'><div class='left_img'>";
                    html += " <img alt='' style='width: 60px;height: 60px;border-radius: 60px' src="+img +" /><br>";
                    html += "<span class='glyphicon '></span> &nbsp;<span>"+c.name+"</span>  </div>";
                    html += "<div class='right_content'>";
                    html += c.content;
                    html += "  </div></div>";


                    $("#cot").append(html);
                }
            }
        })
    })
</script>
<!--列表组-->
<div style="background: url('images/3.jpg');">
    <a class="list-group-item active my-center">
	<span class="glyphicon glyphicon-chevron-left" style="float: left;" onclick="javascript:history.back(-1);">
	</span>评论</a>
</div>
<!-- 评论区开始 -->
<div id="cot">

</div>

<!-- 评论区结束 -->
</div>
</body>
</html>